<template>
    <div class="info">
        <div class="info-title">{{ film.name }}</div>
    </div>
</template>

<script lang="ts" setup>
import type {Film} from '@/api/interface'

defineProps<{
    film: Film.Item
}>()

</script>


<style lang="scss" scoped>
.info{
    position: relative;
    background-color: darkcyan;
    &::before {
        position: absolute;
        content: '';
        display: block;
        transform: translateX(-50%);
        top: -15px;
        left: 50%;
        width: 0;
        height: 0;
        border-width: 10px;
        border-style: solid;
        border-color: transparent transparent #fff transparent;
    }
.info-title{
    height: 36px;
    line-height: 36px;
    font-size: 18px;
    text-align: center;
}
}
</style>